<template>
  <kb-scroll-view>
    <h1>props type</h1>
    <h2>default mix</h2>
    <kb-input v-model="mixValue" placeholder="Any string" />
    <h2>int</h2>

    <kb-input
      v-model="intValue"
      :inputProps="{ type: 'int' }"
      placeholder="only int"
    />
    <div style="height: 140px"></div>
    <h2>float</h2>
    <kb-input
      v-model="floatValue"
      placeholder="2 decimal places"
      :inputProps="{ type: 'float' }"
    />

    <h2>cn</h2>
    <kb-input v-model="cnValue" placeholder="chinese" type="cn" />

    <h2>en</h2>
    <kb-input
      v-model="envalue"
      :inputProps="{ type: 'en' }"
      placeholder="english"
    />

    <kb-board :emojiMap="emoji" />
  </kb-scroll-view>
</template>

<script>
import { person, hearts, symbo } from "../dev/enumerate/emojiImages";
export default {
  name: "App",
  data() {
    return {
      emoji: {
        person,
        hearts,
        symbo,
      },
      intValue: "1",
      floatValue: "1.22",
      cnValue: "鼓励·拿扎",
      envalue: "abc",
      mixValue: "你好啊,world!!你好啊,wo!!d!!",
    };
  },
  methods: {
    submitFn(val) {
      console.log("input 的submit事件", val);
    },
    showStatus(data) {
      console.log("监听键盘显示隐藏", data);
    },
    inputFn({ el, value }) {
      console.log("input", el, value);
    },
    focusFn({ el, value }) {
      console.log("focus", el, value);
    },
    blurFn({ el, value }) {
      console.log("blur", el, value);
    },
  },
};
</script>

<style>
p {
  word-wrap: break-word;
  white-space: pre-wrap;
}
</style>
